<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			* {
				margin: 0px;
				padding: 0px;
				list-style: none;
			}
			
			.brand {
				display: flex;
				margin-top: 20px;
			}
			
			.type {
				display: flex;
				margin-top: 20px;
			}
			
			.brand li,
			.type li {
				width: 100px;
				height: 30px;
				text-align: center;
				line-height: 30px;
			}
			
			.brand li.it.active,
			.type li.it.active {
				background: orange;
			}
			
			.goods {
				display: flex;
				flex-wrap: wrap;
				justify-content: space-between;
			}
			
			.goods li {
				width: 210px;
				width: 210px;
				height: 200px;
				font-size: 14px;
				margin: 10px 0px;
			}

			.goods-title {
				overflow: hidden;
				text-overflow: ellipsis;
				white-space: nowrap;
			}
		</style>
	</head>

	<body>
		<div style="width: 1000px;margin: 200px auto;">
			<a href="购物车.html">我的购物车</a>
			<div style="width: 1000px;display: flex;justify-content: center;">
				<input id="hhh" type="text" style="height: 30px;width: 510px;outline: none;" />
				<button class="btn" style="height: 34px ;width: 100px;">搜索</button>
			</div>
			<ul class="brand">
				<li>品牌:</li>
				<li class="it active">全部</li>

			</ul>
			<ul class="type">
				<li>类型:</li>
				<li class="it active">全部</li>
			</ul>
			<ul class="goods"> 

			</ul>
		</div>
		<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
		<script src="https://cdn.bootcss.com/jquery-cookie/1.4.1/jquery.cookie.js"></script>
		<script src="js/筛选.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			$(function() {
				$.gouwu.init()
			})
		</script>
	</body>

</html>